<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>我的知识信息列表</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <link rel="stylesheet" href="${ctx}/qbdmsStatic/iconfont/iconfont.css"/>
    <link rel="stylesheet" href="${ctx}/qbdmsStatic/style/qbdms.css">
    <link rel="stylesheet" href="${ctx}/layui/css/layui.css" media="all"/>
    <link rel="stylesheet" href="${ctx}/systemStatic/style/admin.css">
    <link rel="stylesheet" href="${ctx}/iconfont/iconfont.css"/>
    <link rel="stylesheet" href="${ctx}/css/public.css">
    <script type="text/javascript">
        var __ctx = "${ctx}";
    </script>
    <style>
        .layui-tab.layui-tab-brief{
            position: absolute;
            top: 20px;
            left: 40px;
            bottom: 20px;
            right: 42px;
            /*overflow: auto;*/
        }
        .layui-tab .layui-tab-title{
            border-bottom:none ;
            left: 120px;
            position: absolute;
        }
        .layui-tab .layui-tab-title li{
            color:#A1A3A9 ;
            font-size: 16px;
            padding: 0 24px;
        }
        .layui-tab-title .layui-this:after{
            top:10px;
        }
        .layui-tab-brief>.layui-tab-more li.layui-this:after, .layui-tab-brief>.layui-tab-title .layui-this:after{
            border-bottom-color: #2682FF;
        }
        .layui-tab-brief>.layui-tab-title .layui-this{
            color:#2682FF ;
        }
        .layui-card-header.config{
            border-bottom:none ;
            color: #656877;
            font-size: 14px;
            font-weight: bold;
            margin-top: 16px;
        }
        .layui-btn-container .qbdms-btn-config{
            background-color:#fff ;
            border: 1px solid #E5F0FF;
            width: 144px;
            height: 44px;
            line-height: 44px;
            color:#656877 ;
            font-size: 14px;
            margin:0 20px 20px 0;
            position: relative;
        }
        .layui-btn-container .qbdms-btn-config i{
            position: absolute;
            bottom: -14px;
            color: #2682FF;
            right: 0;
        }
        .layui-btn-container .qbdms-btn-config:hover{
            color:#2682FF;
            background-color:#F6F9FE ;
            border-color: #2682FF;
        }
        .layui-btn-container .layui-btn.qbdms-configs{
            color:#2682FF;
            background-color:#F6F9FE ;
            border-color: #2682FF;
        }
        /*滚动条样式*/
        .qbdms-list-content .right-list::-webkit-scrollbar {
            width: 4px;
            /*height: 4px;*/
        }
        .qbdms-list-content .right-list::-webkit-scrollbar-thumb {
            border-radius: 10px;
            /*-webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2);*/
            background: #c1c5cd;
        }
        .qbdms-list-content .right-list::-webkit-scrollbar-track {
            /*-webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2);*/
            border-radius: 0;
            background: #f5f5f5;

        }
        #list .layui-icon-star-fill{
            color: #2682ff;
        }
        #list .layui-icon.iconcollection{
            cursor: pointer;
            margin-left: 16px;
        }
        #list span.collections{
            margin-left: 0;
        }
        #list2 .layui-icon-star-fill{
            color: #2682ff;
        }
        #list2 .layui-icon.iconcollection{
            cursor: pointer;
            margin-left: 16px;
        }
        #list2 span.collections{
            margin-left: 0;
        }

        .layui-tab-content .layui-tab-item{
            height: 100%;
        }
        .qbdms-noData{
            position: absolute;left: 50%;top:40%;transform:translate(-50%,-40%);
            display: none;
            text-align: center;
            z-index: 1111;
        }
        .qbdms-noData div{
            margin-top: 10px;
        }
        .layui-tab-title .iconfont{
            margin-right: 6px;
        }
        .layui-tab .layui-tab-title li .iconfont{
            color: #c0c4cc;
        }
        .layui-tab .layui-tab-title li.layui-this .iconfont{
            color: #2682FF;
        }
        .qbdms-list-content .right-list .caller-main{
            left: 80px!important;
        }
        .qbdms-list-content .right-list{
            padding-left: 0!important;
            bottom: 46px;
        }
        div.qbdms-list{
            padding: 0!important;
        }
        #qbdmspage2,#qbdmspage{
            position: absolute;
            right: 0;
            bottom: 0;
        }
    </style>
</head>
<body class="listBody">
<div class="qbdms-bodyDiv" style="position: relative">
    <div class="qbdms-noData" id="zwsc">
        <img src="${ctx}/qbdmsStatic/images/no.png" alt="">
        <div>暂无收藏</div>
    </div>
    <div class="qbdms-noData" id="zwgz">
        <img src="${ctx}/qbdmsStatic/images/no.png" alt="">
        <div>暂无关注</div>
    </div>
    <div style="background-color: #fff;height: 100%">
        <div class="layui-table-view-body" style="padding: 0 24px 24px;">
            <div class="qbdms-formTitle" style="border-bottom: 1px solid #E5F0FF;font-size: 16px">我的知识
                <div class="layui-tab layui-tab-brief" lay-filter="wQbdMyKnowledge">
                    <ul class="layui-tab-title">
                        <li class="layui-this"><i class="iconfont data-iconcommon_shoucang-solid"></i>我的未读</li>
                    </ul>
                    <div class="layui-tab-content" style=" position: absolute; top: 45px; bottom: 0; right: 0; left:0px">
                        <div class="layui-tab-item layui-show">
                            <div class="qbdms-list" style="padding: 0">
                                <div class="layui-table-view-body " style="height: 100%;position: relative;padding: 0">
                                    <!--<div class="qbdms-title" >
                                        <div class="rightCon">
                                            <div style="display: inline-block;position: relative">
                                                <input name="content" id="content" type="text" class="layui-input" placeholder="请输入" style="width:232px " />
                                                <i class="layui-icon layui-icon-search" qbdms-event="selCon"></i>
                                            </div>
                                        </div>
                                    </div>-->
                                    <div class="qbdms-list-content" style="right: 0;left: 0">
                                        <div class="right-list layui-form" id="right-list" style="left: 0">
                                            <div id="list">
                                            </div>
                                        </div>
                                    </div>
                                    <div id="qbdmspage">
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
    <script src="${ctx}/qbdmsStatic/public/configFile.js"></script>
    <script src="${ctx}/layui/layui.js"></script>
    <script>
        //一般直接写在一个js文件中
        layui.config({
            base: serverPath.qbdmsPath + staticPath.qbdmsPath //静态资源所在路径
        }).extend({
            index: 'lib/index' //主入口模块
        }).use(['index','setter', 'form', 'common','jquery','layer','tree','laypage','element','publicMethods'], function () {
            var setter = layui.setter;
            var form = layui.form;
            var common = layui.common;
            var $ = layui.jquery;
            var layer = layui.layer;
            var tree=layui.tree;
            var laypage = layui.laypage;
            var publicMethods = layui.publicMethods;

            //刚进入list刷新
            query(1);
            function query (type,page){
                var content=$("#content").val();
                var url=serverPath.qbdmsPath + "/qbdms/wQbdMyKnowledge/messageList";
                var list_id="#list";
                var page_id="qbdmspage";
                $(list_id).html("");
                $(".qbdms-noData").css('display','none');
                $.ajax({
                    url:url,
                    type: "post",
                    dataType: 'json',
                    success: function (data) {
                        var count=data.data.length;
                        var data =data.data;
                        if(count==0){
                            if(type==1){
                                $("#zwsc").css('display','block');return ;
                            }
                            if(type==2){
                                $("#zwgz").css('display','block');return ;
                            }
                        }
                        var list=  dataShow(data)
                        $(list_id).append(list);
                        form.render();
                    },
                    error: function (XMLHttpRequest, textStatus, errorThrown) {
                    }
                })
            }

            function dataShow(data){
                var htmlCon='';
                layui.each(data,function (i,item) {
                    var src= JSON.parse(item.enclosure)[0].fileName;
                    var reg = RegExp(/.pdf/);
                    if(src.match(reg)){
                        src="${ctx}/qbdmsStatic/images/pdf.png"
                    }
                    var regword=RegExp(/.doc/);
                    var regword1=RegExp(/.docx/);
                    if (src.match(regword)||src.match(regword1))
                    {
                        src="${ctx}/qbdmsStatic/images/word.png"
                    }
                    var regexcel=RegExp(/.xls/);
                    var regexcel1=RegExp(/.xlsx/);
                    if (src.match(regexcel)||src.match(regexcel1))
                    {
                        src="${ctx}/qbdmsStatic/images/excel.png"
                    }
                    htmlCon=htmlCon+'<div class="caller-item"><img src="'+src+'" alt=""> <div class="caller-main"> <p class="main-tit"  id="'+item.id+'" qbdms-event="particulars">'+item.knowledgeName+'</p>'+
                        '<p class="detailed">'+item.summaryDocument+'</p>'+
                        '<div class="main-fun"> <div class="leftCon"> <span class="classification">密级:'+item.secret+'</span>'+
                        '<span class="nameInfo">'+item.fillman+'</span> <span class="timeInfo">发布于 '+publicMethods.timeData(item.createTime)+'</span> </div> <div class="rightCon">'+
                        '<span qbdms-event="downloadFile" fileId="'+item.fileId+'" ><i class="layui-icon layui-icon-link" style="font-size: 12px"></i>下载文件</span>'+
                        ' </div> </div> </div> </div>'
                });
                return  htmlCon;
            }

            var events={
                //下载文件
                downloadFile:function () {
                    var obj=this;
                    var fileId=$(obj).attr("fileId");
                     window.location.href =  "${ctx}"+setter.extendLinkPath + "attachFile/download?fileId=" + fileId;
                },
                //详情
                particulars:function () {
                    var obj=this;
                    var id=$(obj).attr("id");
                    window.location.href = serverPath.qbdmsPath + "/qbdms/wQbdMyKnowledge/view/particulars?isPopupRemindData=true&id="+id;
                }
            };

            //点击事件
            $('body').on('click', '*[qbdms-event]', function(){
                var othis = $(this) ,
                    attrEvent = othis.attr('qbdms-event');
                events[attrEvent] && events[attrEvent].call(this, othis);
            });
        });
    </script>
</body>
</html>